<template>
	<view>
		<view class="header">
			<view class="header_content">
				<view class="header_content_top">
					<view class="useableiItegral">
						<view class="useableiItegral_number">
							<image src="../../../../static/img/personCenter/integral/integral.png" mode=""></image>
							<text>6300</text>
						</view>
						<view class="useableiItegral_text">
							可用积分
						</view>
					</view>
					<view class="date">
						<text>积分有效期至：2020-12-30</text>
					</view>
				</view>
				<view class="header_content_bottom">
					<view class="details" @click="onNavigateTo('/pages/tabbar/personCenter/integral/integralDetail')">
						积分明细
					</view>
					<view class="details1" @click="onNavigateTo('/pages/tabbar/personCenter/integral/exchange')">
						积分兑换记录
					</view>
				</view>
			</view>
		</view>
		<view class="container">
			<view class="container_title">
				<view class="blueBot"></view>
				<text>积分商品</text>
			</view>
			<view class="content">
				<view class="list" v-for="(item,index) in list" :key="index" @click="onNavigateTo('/pages/tabbar/personCenter/integral/shopsDetail?id='+item)">
					<image :src="item.img" mode=""></image>
					<view class="list_info">
						 <view class="list_info_top">
						 	<view class="shopsType">
								{{item.type==1?'商品':'药品'}}
						 	</view>
							<text>{{item.title}}</text>
						 </view>
						 <view class="list_bottom">
						 	<text>{{item.integral}}</text>
						 	<text>积分</text>
						 	<text>+{{item.price}}</text>
						 	<view class="purchase">
						 		总换
						 	</view>
						 </view>
					</view>
					
				</view>
			</view>
			
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[
					{
						img:"../../../../static/img/index/12.JPG",
						integral:20,
						price:80,
						title:'可口可乐',
						id:1,
						type:1
					},
					{
						img:"../../../../static/img/index/12.JPG",
						integral:30,
						price:120,
						title:'雪碧',
						id:2,
						type:1
					},
					{
						img:"../../../../static/img/index/12.JPG",
						integral:40,
						price:160,
						title:'炸鸡',
						id:3,
						type:1
					},
					{
						img:"../../../../static/img/index/12.JPG",
						integral:20,
						price:200,
						title:'感冒药',
						id:4,
						type:2
					},
				]
			};
		},
		methods:{
			onNavigateTo(url){
					uni.navigateTo({
						url:url
					});
			}
		}
	}
</script>

<style lang="scss">
@import './css/integral.scss';
</style>
